<template>
  <div>
    <home-header></home-header>
    <home-footer></home-footer>
    <home-swippar :SwiperList="SwiperList"></home-swippar>
    <home-icons :IconList="IconList"></home-icons>
    <home-goods :recoList="recoList"></home-goods>
  </div>
</template>

<script>
  import HomeHeader from "./components/HomeHeader";
  import HomeFooter from "./components/HomeFooter";
  import HomeSwippar from "./components/HomeSwippar";
  import HomeIcons from "./components/HomeIcons";
  import HomeGoods from "./components/HomeGoods";
  import axios from "axios"
  export default {
      name: "Home",
      components:{
        HomeGoods,
        HomeIcons,
        HomeSwippar,
        HomeFooter,
        HomeHeader
      },
    data(){
        return{
          recoList:[],
          IconList:[],
          SwiperList:[]
        }
    },
    methods:{
        //通过axios插件获取index.json中的所有数据
        getHomeData(){
          axios.get('/static/data/index.json').then(this.getHomeDataSucc)
        },
      //读取数据成功后调用的方法，将json中的数据储存到当前Home组件内部
      getHomeDataSucc(res){
          res=res.data
          if(res.ret && res.data){
            var data=res.data
            this.recoList=data.recoList
            this.IconList=data.IconList
            this.SwiperList=data.SwiperList
          }
      }
    },
    //使用生命钩子函数方法读取json文件
    mounted() {
        this.getHomeData()
    }
  }
</script>

<style scoped>

</style>
